@use './variables.scss' as *;

// ==================== 全局样式重置和基础样式 ====================

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: $font-family;
  font-size: $font-base;
  line-height: $line-height-normal;
  color: $text-primary;
  background: $bg-secondary;
}

// -------------------- 滚动条样式 --------------------
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: $bg-tertiary;
}

::-webkit-scrollbar-thumb {
  background: $border-dark;
  border-radius: $radius-full;

  &:hover {
    background: $text-tertiary;
  }
}

// -------------------- 选中文本样式 --------------------
::selection {
  background: rgba($primary-color, 0.2);
  color: $primary-darker;
}

// -------------------- 链接样式 --------------------
a {
  color: $primary-color;
  text-decoration: none;
  transition: $transition-color;

  &:hover {
    color: $primary-dark;
  }
}

// -------------------- 图片通用样式 --------------------
img {
  max-width: 100%;
  height: auto;
  display: block;
}

// -------------------- 按钮通用优化 --------------------
.ant-btn {
  border-radius: $radius-md !important;
  font-weight: $font-medium;
  transition: $transition-all;
  box-shadow: $shadow-xs;

  &:hover {
    transform: translateY(-1px);
    box-shadow: $shadow-sm;
  }

  &:active {
    transform: translateY(0);
  }

  &-primary {
    background: $gradient-primary;
    border: none;

    &:hover {
      background: $gradient-primary;
      filter: brightness(1.1);
    }
  }

  &-lg {
    border-radius: $radius-lg !important;
    height: 44px;
    padding: 0 $spacing-lg;
  }
}

// -------------------- 卡片通用优化 --------------------
.ant-card {
  border-radius: $radius-lg !important;
  border: none;
  box-shadow: $shadow-card;
  transition: $transition-all;

  &:hover {
    box-shadow: $shadow-card-hover;
  }

  .ant-card-head {
    border-bottom: 1px solid $border-light;
  }

  .ant-card-body {
    padding: $spacing-lg;
  }
}

// -------------------- 输入框通用优化 --------------------
.ant-input,
.ant-input-search,
.ant-select-selector,
.ant-input-number {
  border-radius: $radius-md !important;
  transition: $transition-all;

  &:hover {
    border-color: $primary-light;
  }

  &:focus,
  &-focused {
    border-color: $primary-color;
    box-shadow: 0 0 0 2px rgba($primary-color, 0.1);
  }
}

// -------------------- 模态框优化 --------------------
.ant-modal {
  .ant-modal-content {
    border-radius: $radius-xl !important;
    box-shadow: $shadow-2xl;
  }

  .ant-modal-header {
    border-bottom: 1px solid $border-light;
    border-radius: $radius-xl $radius-xl 0 0 !important;
  }

  .ant-modal-footer {
    border-top: 1px solid $border-light;
  }
}

// -------------------- 标签优化 --------------------
.ant-tag {
  border-radius: $radius-md !important;
  border: none;
  padding: 2px 10px;
  font-size: $font-sm;
  font-weight: $font-medium;
}

// -------------------- 分页优化 --------------------
.ant-pagination {
  .ant-pagination-item {
    border-radius: $radius-md !important;
    border: 1px solid $border-normal;
    transition: $transition-all;

    &:hover {
      border-color: $primary-color;
      transform: translateY(-2px);
    }

    &-active {
      background: $gradient-primary;
      border-color: transparent;

      a {
        color: white;
      }
    }
  }

  .ant-pagination-prev,
  .ant-pagination-next {
    .ant-pagination-item-link {
      border-radius: $radius-md !important;
      transition: $transition-all;

      &:hover {
        border-color: $primary-color;
        transform: translateY(-2px);
      }
    }
  }
}

// -------------------- 空状态优化 --------------------
.ant-empty {
  .ant-empty-image {
    height: 120px;
    margin-bottom: $spacing-lg;
    opacity: 0.6;
  }

  .ant-empty-description {
    color: $text-tertiary;
    font-size: $font-base;
  }
}

// -------------------- 加载动画优化 --------------------
.ant-spin {
  .ant-spin-dot {
    i {
      background-color: $primary-color;
    }
  }
}

// -------------------- 通用工具类 --------------------
.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.text-ellipsis {
  @include text-ellipsis;
}

.flex-center {
  @include flex-center;
}

.flex-between {
  @include flex-between;
}

.gradient-text {
  background: $gradient-primary;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.glass {
  @include glass;
}

// -------------------- 响应式辅助类 --------------------
@include responsive($breakpoint-md) {
  .hide-on-mobile {
    display: none !important;
  }
}

@media (min-width: $breakpoint-md) {
  .show-on-mobile {
    display: none !important;
  }
}

